import React, { Component } from 'react'
import Tabbar from '../Tabbar/Tabbar'
import styles from './My.module.scss'
import { withRouter } from 'react-router-dom'


class My extends Component {
  state = {
    took : ''
  }
  componentDidMount(){
    let took = JSON.parse(localStorage.getItem("took"))
    this.setState({
      took : took
    })

  }
  render() {
    console.log(this.state.took)
    return (
      <div>
        <div className={styles.my}>
          <div className={styles.header}>
            <div className={styles.left}><img src="/pgc-image/header.png" alt=""/></div>
            {this.state.took?<div className={styles.right}> {this.state.took} </div>:<div className={styles.right} onClick={()=>{
              this.props.history.push('/login')
            }}>登录 / 注册</div>}
            
          </div>
          <div className={styles.center}>
            <div className={styles.item}>
              <div className={styles.item_left}>我的会员</div>
              <div className={styles.item_right}>{'开通会员 >'}</div>
            </div>
            <div className={styles.item}>
              <div className={styles.item_left}>书豆</div>
              <div className={styles.item_right}>{'充值 >'}</div>
            </div>
            <div className={styles.item}>
              <div className={styles.item_left}>消费充值记录</div>
              <div className={styles.item_right}>{'>'}</div>
            </div>
            <div className={styles.item}>
              <div className={styles.item_left}>购买过的书</div>
              <div className={styles.item_right}>{'>'}</div>
            </div>
            <div className={styles.item}>
              <div className={styles.item_left}>意见反馈</div>
              <div className={styles.item_right}>{'ID:8000000 >'}</div>
            </div>
          </div>
        </div>
        <Tabbar></Tabbar>
      </div>
    )
  }
}
export default withRouter(My);
